<template>
  <div id="amap-page-container">
    <el-amap  vid="amap-demo"   :zoom="zoom" :center="center" :resizeEnable="resizeEnable" :bubble="bubble" class="amap-demo">
      <el-amap-polyline :editable="polyline.editable"  :path="polyline.path" :events="polyline.events" ></el-amap-polyline>
    </el-amap>
  </div>
</template>

<script>
  export default {
    name: 'AMap',
    props: {
      polyArr: {
        type: Array,
        default: [[121.5389385, 31.21515044], [121.5389385, 31.29615044], [121.5273285, 31.21515044]]
      },
      centerPoint:{
        type: Array,
        default: [113.62493,34.74725]
      }
    },
    data() {
      return {
        resizeEnable:true,
        visible:true,
        bubble:true,
        zoom: 15,
        center: this.centerPoint,
        polyline: {
          path: this.polyArr,
          editable: false
        }
      };
    },
    mounted() {

    },
    created() {

    },
    beforeDestroy() {
      // 销毁地图
      // this.map.destroy();
    },
    methods: {
    }
  };
</script>

<style lang="scss">
  #amap-page-container{
    width: 100%;
    height: 90%;
  }
  .amap-demo {
    width: 100%;
    height: 90%;
  }
</style>
